<!--
 * @Author: szx
 * @Date: 2022-06-30 14:28:35
 * @LastEditTime: 2022-06-30 14:39:16
 * @Description: 
 * @FilePath: \learn\HTML\其他\点赞动画效果\index.html
-->
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>点赞动画效果</title>
    <link rel="stylesheet" href="index.css">
</head>

<label for="checkbox">
    <input type="checkbox" id="checkbox" hidden>
    <svg t="1639041971928" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
        p-id="3128">
        <path
            d="M512 896a42.666667 42.666667 0 0 1-30.293333-12.373333l-331.52-331.946667a224.426667 224.426667 0 0 1 0-315.733333 223.573333 223.573333 0 0 1 315.733333 0L512 282.026667l46.08-46.08a223.573333 223.573333 0 0 1 315.733333 0 224.426667 224.426667 0 0 1 0 315.733333l-331.52 331.946667A42.666667 42.666667 0 0 1 512 896z"
            p-id="3129" id="heart"></path>
    </svg>
    <span></span>
</label>
</body>

</html>